// SET THIS VARIABLE FOR DELAY, 1000 = 1 SECOND
var delayLength = 8000;
var sliderIntervalID;

function doMove(panelWidth, tooFar, order) {
	clearInterval(sliderIntervalID);
	var movement;
	if (order >= 0) {
		movement = -panelWidth * order;
	}
	else {
		order = parseInt($("#ss-number li a.active").html());
		movement = -panelWidth * order;
		if (movement == tooFar) {
			movement = 0;
			order = 0;
		}
	}

	$(".ss-slide img").animate({
		"top": -200
	}, function() {
		$("#ss-mover").animate({
			"left": movement
		}, function() {
			$("#ss-number li a").removeClass("active");
			$($("#ss-number li a")[order]).addClass("active");
			$(".ss-slide img").animate({
				"top": 20
			});
		});
	});

	sliderIntervalID = setInterval(function() {
		doMove(panelWidth, tooFar, -1);
	}, delayLength);
}

$(function() {
	if ($(".ss-slide").length > 0) {
		var $slide1 = $(".ss-slide").first();

		var panelWidth = $slide1.css("width");
		var panelPaddingLeft = $slide1.css("paddingLeft");
		var panelPaddingRight = $slide1.css("paddingRight");

		panelWidth = parseFloat(panelWidth, 10);
		panelPaddingLeft = parseFloat(panelPaddingLeft, 10);
		panelPaddingRight = parseFloat(panelPaddingRight, 10);

		panelWidth = panelWidth + panelPaddingLeft + panelPaddingRight;

		var numPanels = $(".ss-slide").length;
		var tooFar = -(panelWidth * numPanels);
		var totalMoverwidth = numPanels * panelWidth;
		$("#ss-mover").css("width", totalMoverwidth);

		for (var i = 1; i <= numPanels; i++) {
			if (i == 1) {
				$("#ss-number").append('<li><a class="active">' + i + '</a> </li>');
			}
			else {
				$("#ss-number").append('<li><a>' + i + '</a> </li>');
			}
		}

		setTimeout(function() { doMove(panelWidth, tooFar, -1); }, delayLength);

		$("#ss-number li a").click(function() {
			doMove(panelWidth, tooFar, parseInt($(this).html()) - 1);
		});
	}
});